<template>
  <div class="full-height full-width">
    <div :id="nowId" class="full-height  full-width  height250"></div>
  </div>
</template>
<script>
import * as echarts from "echarts";
export default {
  props: {
    nowId: {
      default: "chartid_" + Math.floor(Math.random() * 50000) + 1,
      type: String
    },
    optionChart: {
      default: () => {
        return {};
      },
      type: Object
    }
  },
  watch: {
    optionChart(n) {
      this.initChart();
    }
  },
  data() {
    return {};
  },
  mounted() {
    this.initChart();
  },
  methods: {
    initChart() {
      let myChart2 = echarts.init(document.getElementById(this.nowId));
      myChart2.setOption(this.optionChart, true);
    }
  }
};
</script>
<style lang="scss"></style>
